<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>编辑用户信息</title>
	<!-- 引入 Tailwind CSS CDN -->
	<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
	<!-- 引入 Font Awesome 图标库 -->
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
	<!-- 引入 SweetAlert2 库 -->
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11.4.10/dist/sweetalert2.min.css">
	<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.4.10/dist/sweetalert2.all.min.js"></script>
</head>

<body class="bg-gray-100">
<!-- 导航栏 -->
<header class="bg-white py-3 shadow-md">
	<div class="container mx-auto px-4">
		<div class="flex justify-between items-center">
			<h1 class="text-xl font-bold text-gray-800">编辑用户信息</h1>
			<a href="userInfo.html" class="text-gray-600 hover:text-gray-800">
				<i class="fa fa-arrow-left mr-1"></i> 返回
			</a>
		</div>
	</div>
</header>

<!-- 编辑表单 -->
<div class="container mx-auto px-4 py-8">
	<div class="bg-white p-6 rounded-md shadow-md">
		<form id="editUserForm">
			<div class="mb-4">
				<label for="username" class="block text-sm font-medium text-gray-700">用户名</label>
				<input type="text" id="username" name="username" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm">
			</div>
			<div class="mb-4">
				<label for="nickName" class="block text-sm font-medium text-gray-700">昵称</label>
				<input type="text" id="nickName" name="nickName" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm">
			</div>
			<div class="mb-4">
				<label for="phone" class="block text-sm font-medium text-gray-700">手机号</label>
				<input type="text" id="phone" name="phone" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm">
			</div>
			<div class="mb-4">
				<label for="email" class="block text-sm font-medium text-gray-700">邮箱</label>
				<input type="email" id="email" name="email" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm">
			</div>
			<div class="mb-4">
				<label for="gender" class="block text-sm font-medium text-gray-700">性别</label>
				<select id="gender" name="gender" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm">
					<option value="1">男</option>
					<option value="2">女</option>
				</select>
			</div>
			<div class="mb-4">
				<label for="age" class="block text-sm font-medium text-gray-700">年龄</label>
				<input type="number" id="age" name="age" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm">
			</div>
			<div class="mb-4">
				<label for="jobInterest" class="block text-sm font-medium text-gray-700">求职意向</label>
				<input type="text" id="jobInterest" name="jobInterest" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm">
			</div>
			<div class="mb-4">
				<label for="techTack" class="block text-sm font-medium text-gray-700">技术栈（逗号分隔）</label>
				<input type="text" id="techTack" name="techTack" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm">
			</div>
			<div class="flex justify-end">
				<button type="submit" class="bg-blue-500 hover:bg-blue-600 text-white font-medium py-2 px-4 rounded-md">保存</button>
			</div>
		</form>
	</div>
</div>

<!-- 引入 JavaScript 文件 -->
<script src="../js/editUserInfo.js"></script>
</body>

</html>